<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<%
	String path = request.getContentType();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<base href="<%=basePath%>" />
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
   
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.3/themes/icon.css">
<script type="text/javascript" src="jquery-easyui-1.3.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
	$(function(){
		var treeData = [{
			text:'跟目录',
			children:[{
				text:'班级管理',
				children:[{
					text:'班级信息管理',
					attributes:{
						url:"grade.jsp"
					}
				}]
			},{
				text:'学生管理',
				children:[{
					text:'学生信息管理',
					attributes:{
						url:"student.jsp"
					}
				}]
			}]
		}];
		$("#tree").tree({
			data:treeData,
			lines:true,//虚线
			onClick:function(node){
				if(node.attributes){
					if(!$("#tabs").tabs('exists',node.text)){
						$("#tabs").tabs("add",{
							title:node.text,
							closable:true,
							iconCls:"icon-ok",
							content:"<iframe frameborder='0' scrolling='auto' style='width:100%;height:100%' src="+node.attributes.url+"></iframe>"
						});
					}else{
						$("#tabs").tabs("select",node.text);
					}; 
					
				}
				
			}
		});
	});
</script>
</head>
<!--1.class样式必须放在body标签上 ；
	2.外层容器
 -->
<body class="easyui-layout">
	<!--只能用region属性，使用data-options属性无效  -->
	<div region="north" style="height:70px;background:rgb(224,237,255)url(img/main.jpg) no-repeat;">
		<div style="float:right;margin:15px 100px;font-weight:bold;font-size:20px;">欢迎   : ${user.userName}</div>
	</div>
	
	<!-- split:可收放 -->
	<div region="west" style="width:150px" title="菜单树" split="true">
		<ul id="tree"></ul>
	</div>
	
	<!--center是必须的；没有center收放功能不可用提示 e is undefined  -->
	<div region="center" style="border-color:green">
		<div class="easyui-tabs" id="tabs" style="border-color:red;height:485px;"><!-- height:485px固定高度，窗口缩小后出现滚动条 -->
			<div title="首页">
				<!--  背景图片过大，通过width:100%,height:100%按比例缩小大小适应窗口-->
				<img src="img/bjsxt.jpg" style="position:fixed;top:100px;width:100%;height:100%;"/>
			</div>
		</div>
	</div>
	
	<div region="east" title="推广连接" split="true" style="width:130px;padding-left:10px;"><a href="http://www.baidu.com" target="_blank">百度一下</a></div>
	
	<div region="south" style="font-weight:bold;font-size:15px;height:30px;background:rgb(224,237,255);" align="center">版权所有 侵权不究</div>
</body>
</html>